<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
    <title>摄影师修改信息</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <style>
        @media screen and (max-width: 2000px) {
            #alterInfoDiv {
                width: 700px;
                height: 0px;
            }

            h3 {
                margin-left: 140px;
                margin-top: 10px;
                margin-bottom: 20px;
            }

            .row-bg {
                margin-top: 10px;
            }

            .pgrInfoLable {
                margin-left: 40px;
                float: left;
                height: 40px;
                width: 100px;
                line-height: 40px;
            }

            .pgrInfoContent {
                width: 200px;
            }

            #form {
                margin-left: 0px;
                margin-top: 0px;
                width: 800px;
                height: 500px;
            }

            .genderItem {
            }

            .pgrInfoBtn {
                width: 120px;
                height: 40px;
            }

            #pgrInfoAlterBtn {
                margin-left: 50px;
                margin-top: 0px;
                margin-right: 20px;
            }

            .pgrInfoTag {
                height: 30px;
            }

            #selectItem {
                width: 175px;
            }

            #pgrBookTime {
                position: absolute;
                left: 500px;
                width: 590px;
                height: 400px;
            }

            #bkDateTime {
                text-align: center;
                width: 590px;
                height: 40px;
            }

            .bkDateTimeLable {
                padding: 0px 9px;
            }

            #bkSession {
                width: 600px;
                height: 300px;
                padding-right: 9px;
            }

            .bkDateSession {
                float: left;
                width: 80px;
                height: 250px;
                margin-right: 5px;
            }

            .bkbtn {
                float: right;
                width: 80px;
                padding-left: 0px;
                margin-top: 20px;
            }

            #bkDateTip {
                width: 600px;
                height: 60px;
                border-top: 1px lightskyblue solid;
                line-height: 60px;
                text-align: center;
            }
        }
    </style>
</head>
<body>
<div id="alterInfoDiv">
    <h3>修改摄影师信息</h3>
    <el-form v-model="form" ref="form">
        <el-form-item>
            <div id="pgrNameDetail" class="pgrInfoLable">姓名:</div>
            <el-input v-model.trim="form.name" id="pgrNameContent" placeholder="请输入姓名" class="pgrInfoContent"
                      v-on:blur="nameTagChange"></el-input>
            <el-tag v-model="form.nameTag" v-bind:type="form.nameTagType" v-bind:style="nameTagStyle"
                    class="pgrInfoTag">{{nameTagContent}}
            </el-tag>
        </el-form-item>
        <el-form-item>
            <div id="pgrGenderDetail" class="pgrInfoLable">性别:</div>
            <el-radio v-model.trim="form.gender" class="genderItem" label="1">男</el-radio>
            <el-radio v-model.trim="form.gender" class="genderItem" label="2">女</el-radio>
        </el-form-item>
        <el-form-item>
            <div id="pgrAgeDetail" class="pgrInfoLable">年龄:</div>
            <el-input v-model.trim="form.age" id="pgrAgeContent" placeholder="请输入年龄" class="pgrInfoContent"
                      v-on:blur="ageTagChange"></el-input>
            <el-tag v-model="form.ageTag" v-bind:type="form.ageTagType" v-bind:style="ageTagStyle" class="pgrInfoTag">
                {{ageTagContent}}
            </el-tag>
        </el-form-item>
        <el-form-item>
            <div id="pgrTelDetail" class="pgrInfoLable">联系电话:</div>
            <el-input v-model.trim="form.mobile" id="pgrTelContent" placeholder="请输入联系电话" class="pgrInfoContent"
                      v-on:blur="telTagChange"></el-input>
            <el-tag v-model="form.telTag" v-bind:type="form.telTagType" v-bind:style="telTagStyle" class="pgrInfoTag">
                {{telTagContent}}
            </el-tag>
        </el-form-item>
        <el-form-item>
            <div id="pgrUserNameDetail" class="pgrInfoLable">用户名:</div>
            <el-input v-model.trim="form.userName" id="pgrUserNameContent" placeholder="请输入用户名" class="pgrInfoContent"
                      v-on:blur="userNameTagChange"></el-input>
            <el-tag v-model="form.userNameTag" v-bind:type="form.userNameTagType" v-bind:style="userNameTagStyle"
                    class="pgrInfoTag">
                {{userNameTagContent}}
            </el-tag>
        </el-form-item>
        <el-form-item>
            <div id="pgrPasswordDetail" class="pgrInfoLable">密码:</div>
            <el-input v-model.trim="form.password" id="pgrPasswordContent" placeholder="请输入密码" class="pgrInfoContent"
                      v-on:blur="passwordTagChange"></el-input>
            <el-tag v-model="form.passwordTag" v-bind:type="form.passwordTagType" v-bind:style="passwordTagStyle"
                    class="pgrInfoTag">
                {{passwordTagContent}}
            </el-tag>
        </el-form-item>
        <el-form-item>
            <div id="pgrCompDetail" class="pgrInfoLable">所属公司:</div>
            <el-select v-model="form.select" v-bind:placeholder="form.lableValue" v-bind:disabled="form.selectDisable"
                       @change="changeValue">
                <el-option
                        v-for="item in company"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                    <span style="float: left">{{ item.label }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item>
            <div id="pgrStatusDetail" class="pgrInfoLable">当前状态:</div>
            <el-select v-model="form.selectStatus" v-bind:placeholder="form.lableValueStatus"
                       v-bind:disabled="form.selectDisableStatus"
                       @change="changeValueStatus">
                <el-option
                        v-for="item in status"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                    <span style="float: left">{{ item.label }}</span>
                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.value }}</span>
                </el-option>
            </el-select>
        </el-form-item>
        <el-form-item>
            <el-button v-on:click="alterInfo" type="primary" id="pgrInfoAlterBtn" class="pgrInfoBtn" ref="infoBtn">修改
            </el-button>
            <el-button type="danger" plain id="pgrInfoDeletebtn" class="pgrInfoBtn" v-on:click="deleteInfo">删除
            </el-button>
        </el-form-item>
    </el-form>

</div>
<div id="pgrBookTime">
    <div id="bkDateTime">
        <h4>选择预约时间</h4>
    </div>
    <div id="bkSession">
        <el-form v-model="form" ref="form">
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{dayOne}}</el-tag>
                <el-button v-model="form.dayBtn1" v-bind:type="form.dayType1"
                           v-on:click="dateSubmit(1)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn2" v-bind:type="form.dayType2"
                           v-on:click="dateSubmit(2)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn3" v-bind:type="form.dayType3"
                           v-on:click="dateSubmit(3)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn4" v-bind:type="form.dayType4"
                           v-on:click="dateSubmit(4)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{dayTwo}}</el-tag>
                <el-button v-model="form.dayBtn5" v-bind:type="form.dayType5"
                           v-on:click="dateSubmit(5)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn6" v-bind:type="form.dayType6"
                           v-on:click="dateSubmit(6)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn7" v-bind:type="form.dayType7"
                           v-on:click="dateSubmit(7)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn8" v-bind:type="form.dayType8"
                           v-on:click="dateSubmit(8)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{dayThree}}</el-tag>
                <el-button v-model="form.dayBtn9" v-bind:type="form.dayType9"
                           v-on:click="dateSubmit(9)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn10" v-bind:type="form.dayType10"
                           v-on:click="dateSubmit(10)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn11" v-bind:type="form.dayType11"
                           v-on:click="dateSubmit(11)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn12" v-bind:type="form.dayType12"
                           v-on:click="dateSubmit(12)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{dayFour}}</el-tag>
                <el-button v-model="form.dayBtn13" v-bind:type="form.dayType13"
                           v-on:click="dateSubmit(13)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn14" v-bind:type="form.dayType14"
                           v-on:click="dateSubmit(14)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn15" v-bind:type="form.dayType15"
                           v-on:click="dateSubmit(15)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn16" v-bind:type="form.dayType16"
                           v-on:click="dateSubmit(16)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{dayFive}}</el-tag>
                <el-button v-model="form.dayBtn17" v-bind:type="form.dayType17"
                           v-on:click="dateSubmit(17)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn18" v-bind:type="form.dayType18"
                           v-on:click="dateSubmit(18)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn19" v-bind:type="form.dayType19"
                           v-on:click="dateSubmit(19)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn20" v-bind:type="form.dayType20"
                           v-on:click="dateSubmit(20)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{daySix}}</el-tag>
                <el-button v-model="form.dayBtn21" v-bind:type="form.dayType21"
                           v-on:click="dateSubmit(21)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn22" v-bind:type="form.dayType22"
                           v-on:click="dateSubmit(22)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn23" v-bind:type="form.dayType23"
                           v-on:click="dateSubmit(23)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn24" v-bind:type="form.dayType24"
                           v-on:click="dateSubmit(24)" class="bkbtn">下午第二场
                </el-button>
            </div>
            <div class="bkDateSession">
                <el-tag class="bkDateTimeLable">{{daySeven}}</el-tag>
                <el-button v-model="form.dayBtn25" v-bind:type="form.dayType25"
                           v-on:click="dateSubmit(25)" class="bkbtn">上午第一场
                </el-button>
                <el-button v-model="form.dayBtn26" v-bind:type="form.dayType26"
                           v-on:click="dateSubmit(26)" class="bkbtn">上午第二场
                </el-button>
                <el-button v-model="form.dayBtn27" v-bind:type="form.dayType27"
                           v-on:click="dateSubmit(27)" class="bkbtn">下午第一场
                </el-button>
                <el-button v-model="form.dayBtn28" v-bind:type="form.dayType28"
                           v-on:click="dateSubmit(28)" class="bkbtn">下午第二场
                </el-button>
            </div>
        </el-form>
    </div>
    <div id="bkDateTip">
        <span>未选择：</span>
        <el-button type="primary">上午第一场</el-button>
        <span>已选择：</span>
        <el-button type="success">上午第一场</el-button>
    </div>
</div>
</body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
    //所属公司选择框的值
    var company = [{
        value: '2',
        label: 'yige',
    }, {
        value: '3',
        label: 'fuyou',
    }, {
        value: '4',
        label: 'qinyu',
    }, {
        value: '5',
        label: 'xiaoying',
    },];

    var Status = [{
        value: '0',
        label: '正常',
    }, {
        value: '1',
        label: '休息',
    }, {
        value: '2',
        label: '离职',
    },];
    //当前按钮状态，从第二个开始，1表示没预约的状态，0表示已预约状态
    var daySign = [0, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1];
    //修改信息div的vue
    var vm = new Vue({
        el: "#alterInfoDiv",
        data: {
            //姓名框的提示框的css
            nameTagStyle: {
                display: 'none',
                fontSize: '15px',
            },
            //性别框的提示框的css
            ageTagStyle: {
                display: 'none',
                fontSize: '15px'
            },
            //联系电话框的提示框的css
            telTagStyle: {
                display: 'none',
                fontSize: '15px'
            },
            //用户名框的提示框的css
            userNameTagStyle: {
                display: 'none',
                fontSize: '15px',
            },
            //密码框的提示框的css
            passwordTagStyle: {
                display: 'none',
                fontSize: '15px',
            },
            //所属公司框的提示框的css
            compTagStyle: {
                display: 'none',
                fontSize: '15px'
            },

            nameTagContent: '', //姓名框的提示框的内容
            ageTagContent: '',//性别框的提示框的内容
            telTagContent: '',//联系电话框的提示框的内容
            compTagContent: '',//所属公司框的提示框的内容
            userNameTagContent: '', //用户名框的提示框的内容
            passwordTagContent: '', //密码框的提示框的内容
            company: company,//所属公司选择框
            status: Status,
            selectValue: "",
            selectValueStatus: "",
            form: {
                name: '', //姓名
                age: '', //性别
                gender: '1', //年龄 1为男，2为女
                mobile: '',//联系电话
                // company: '',//所属公司
                select: '',//所属公司
                selectStatus: '',//状态
                password: '',//密码
                userName: '',//用户名
                lableValue: "选择所属公司",
                lableValueStatus: "选择摄影师状态",
                selectDisable: false,
                selectDisableStatus: false,
                nameTagType: 'success',//姓名框的提示框的类型
                ageTagType: 'success',//性别框的提示框的类型
                telTagType: 'success',//联系电话框的提示框的类型
                compTagType: 'success',//所属公司框的提示框的类型
                userNameTagType: 'success',//用户名框的提示框的类型
                passwordTagType: 'success',//密码框的提示框的类型
            },
        },
        //初始化方法，将上一个页面拿到的对应摄影师的信息从sessionStorage中取出，显示在表单中
        beforeMount: function () {
            var newName = sessionStorage.getItem('name');
            var newGender = sessionStorage.getItem('gender');
            var newAge = sessionStorage.getItem('age');
            var newTel = sessionStorage.getItem('mobile');
            var newComp = sessionStorage.getItem('company');
            var newTime = sessionStorage.getItem('time');
            var authority = sessionStorage.getItem('authority');
            var username = sessionStorage.getItem('username');
            var password = sessionStorage.getItem('password');
            var status = sessionStorage.getItem('status');

            if (newName != null) {
                this.form.name = newName;
            }
            if (username != null) {
                this.form.userName = username;
                console.log(username);
            }
            if (password != null) {
                this.form.password = password;
            }
            if (newGender != null) {
                if (newGender == "男") {
                    this.form.gender = '1';
                } else {
                    this.form.gender = '2';
                }
            }
            if (newAge != null) {
                this.form.age = newAge;
            }
            if (newTel != null) {
                this.form.mobile = newTel;
            }
            if (authority != null) {
                if (authority == "2") {
                    this.form.lableValue = "yige";
                    this.selectValue = "2";
                    this.form.selectDisable = true;
                } else if (authority == "3") {
                    this.form.lableValue = "fuyou";
                    this.selectValue = "3";
                    this.form.selectDisable = true;
                } else if (authority == "4") {
                    this.form.lableValue = "qinyu";
                    this.selectValue = "4";
                    this.form.selectDisable = true;
                } else if (authority == "5") {
                    this.form.lableValue = "xiaoying";
                    this.selectValue = "5";
                    this.form.selectDisable = true;
                } else if (authority == "1") {
                    if (newComp != null) {
                        if (newComp == "2") {
                            this.form.lableValue = "yige";
                            this.selectValue = "2";
                        } else if (newComp == "3") {
                            this.form.lableValue = "fuyou";
                            this.selectValue = "3";
                        } else if (newComp == "4") {
                            this.form.lableValue = "qinyu";
                            this.selectValue = "4";
                        } else if (newComp == "5") {
                            this.form.lableValue = "xiaoying";
                            this.selectValue = "5";
                        }
                    }
                }
            }
            if (status != null) {
                if (status == 0) {
                    this.form.lableValueStatus = "正常";
                    this.selectValueStatus = 0;
                } else if (status == 1) {
                    this.form.lableValueStatus = "休息";
                    this.selectValueStatus = 1;
                } else if (status == 2) {
                    this.form.lableValueStatus = "离职";
                    this.selectValueStatus = 2;
                }
            }
        },
        methods: {

            changeValue: function (value) {
                this.selectValue = value;
            },
            changeValueStatus: function (value) {
                this.selectValueStatus = value;
            },
            //姓名框的验证，提示框的状态
            nameTagChange: function () {
                if (this.form.name == "") {
                    this.nameTagContent = "姓名不能为空!!!!";
                    this.form.nameTagType = "danger";
                    this.nameTagStyle.display = 'inline';
                } else {
                    this.nameTagContent = "ok";
                    this.form.nameTagType = "success";
                    this.nameTagStyle.display = 'inline';
                }
            },
            //年龄框的验证，提示框的状态
            ageTagChange: function () {
                if (this.form.age == "") {
                    this.ageTagContent = "年龄不能为空!!!!";
                    this.form.ageTagType = "danger";
                    this.ageTagStyle.display = 'inline';
                } else {
                    this.ageTagContent = "ok";
                    this.form.ageTagType = "success";
                    this.ageTagStyle.display = 'inline';
                }
            },
            //联系电话框的验证，提示框的状态
            telTagChange: function () {
                if (this.form.mobile == "") {
                    this.telTagContent = "电话不能为空!!!!";
                    this.form.telTagType = "danger";
                    this.telTagStyle.display = 'inline';
                } else {
                    this.telTagContent = "ok";
                    this.form.telTagType = "success";
                    this.telTagStyle.display = 'inline';
                }
            },
            //用户名框的验证，提示框的状态
            userNameTagChange: function () {
                if (this.form.userName == "") {
                    this.userNameTagContent = "用户名不能为空!!!!";
                    this.form.userNameTagType = "danger";
                    this.userNameTagStyle.display = 'inline';
                } else {
                    this.userNameTagContent = "ok";
                    this.form.userNameTagType = "success";
                    this.userNameTagStyle.display = 'inline';
                }
            },
            //密码框的验证，提示框的状态
            passwordTagChange: function () {
                if (this.form.password == "") {
                    this.passwordTagContent = "密码不能为空!!!!";
                    this.form.passwordTagType = "danger";
                    this.passwordTagStyle.display = 'inline';
                } else {
                    this.passwordTagContent = "ok";
                    this.form.passwordTagType = "success";
                    this.passwordTagStyle.display = 'inline';
                }
            },
            //所属公司框的验证，提示框的状态(暂不用)
            // compTagChange: function () {
            //     if (this.form.selectValue == "") {
            //         this.compTagContent = "所属公司不能为空!!!!";
            //         this.form.compTagType = "danger";
            //         this.compTagStyle.display = 'inline';
            //     } else {
            //         this.compTagContent = "ok";
            //         this.form.compTagType = "success";
            //         this.compTagStyle.display = 'inline';
            //     }
            // },

            //修改摄影师信息
            alterInfo: function () {
                if (this.form.name != "" && this.form.age != "" && this.form.mobile != "" && this.selectValue != ""
                    && this.form.userName != "" && this.form.password != "" && this.selectValueStatus != "") {
                    var company = this.selectValue;
                    var status = this.selectValueStatus;
                    var id = sessionStorage.getItem('id');
                    axios.post('/pgrInfo/alterInfo', {
                        id: id,
                        name: this.form.name,
                        age: this.form.age,
                        mobile: this.form.mobile,
                        company: company,
                        gender: this.form.gender,
                        username: this.form.userName,
                        password: this.form.password,
                        status: status,
                    })
                        .then(function (response) {
                            result = response.data.result;
                            if (result == "0") {
                                window.location.href = "/pgrInfo/index";
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                } else {
                    this.$alert('请完善信息后再提交!', '提示', {
                        confirmButtonText: '确定',
                    });
                }
            },
            //删除摄影师信息
            deleteInfo: function () {
                this.$confirm('是否确认删除该摄影师?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$message({
                        type: 'success',
                        message: '删除成功!'
                    });
                    axios.post('/pgrInfo/deleteInfo', {
                        id: sessionStorage.getItem('id'),
                    })
                        .then(function (response) {
                            result = response.data.result;
                            if (result == "0") {
                                window.location.href = "/pgrInfo/index";
                            }
                        })
                        .catch(function (error) {
                            console.log(error);
                        });
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });

            }
        }

    });
    //预约时间div的
    var vu = new Vue({
        el: "#pgrBookTime",
        data: {
            dayOne: '',//预约时间的第一天（当前日期的下一天）
            dayTwo: '',//预约时间的第二天
            dayThree: "",//预约时间的第三天
            dayFour: "",//预约时间的第四天
            dayFive: "",//预约时间的第五天
            daySix: "",//预约时间的第六天
            daySeven: "",//预约时间的第七天
            form: {
                dayBtn1: '', //预约时间的第一个按钮（按钮从第一天的第一场开始，到第七天的第4场，共28个，竖着排列）
                dayBtn2: '',//
                dayBtn3: '',//
                dayBtn4: '',//
                dayBtn5: '',//
                dayBtn6: '',//
                dayBtn7: '',//
                dayBtn8: '',//
                dayBtn9: '',//
                dayBtn10: '',//
                dayBtn11: '',//
                dayBtn12: '',//
                dayBtn13: '',//
                dayBtn14: '',//
                dayBtn15: '',//
                dayBtn16: '',//
                dayBtn17: '',//
                dayBtn18: '',//
                dayBtn19: '',//
                dayBtn20: '',//
                dayBtn21: '',//
                dayBtn22: '',//
                dayBtn23: '',//
                dayBtn24: '',//
                dayBtn25: '',//
                dayBtn26: '',//
                dayBtn27: '',//
                dayBtn28: '',//预约时间的第28个按钮
                dayType1: 'primary',//预约时间的第一个按钮的类型（未预约为primary，已预约为success）
                dayType2: 'primary',//
                dayType3: 'primary',//
                dayType4: 'primary',//
                dayType5: 'primary',//
                dayType6: 'primary',//
                dayType7: 'primary',//
                dayType8: 'primary',//
                dayType9: 'primary',//
                dayType10: 'primary',//
                dayType11: 'primary',//
                dayType12: 'primary',//
                dayType13: 'primary',//
                dayType14: 'primary',//
                dayType15: 'primary',//
                dayType16: 'primary',//
                dayType17: 'primary',//
                dayType18: 'primary',//
                dayType19: 'primary',//
                dayType20: 'primary',//
                dayType21: 'primary',//
                dayType22: 'primary',//
                dayType23: 'primary',//
                dayType24: 'primary',//
                dayType25: 'primary',//
                dayType26: 'primary',//
                dayType27: 'primary',//
                dayType28: 'primary',//预约时间的第28个按钮的类型（未预约为primary，已预约为success）
            }
        },
        beforeMount: function () {
            //获得预约时间
            axios.post('/pgrInfo/getDate', {})
                .then(function (response) {
                    vu.dayOne = response.data[0];
                    vu.dayTwo = response.data[1];
                    vu.dayThree = response.data[2];
                    vu.dayFour = response.data[3];
                    vu.dayFive = response.data[4];
                    vu.daySix = response.data[5];
                    vu.daySeven = response.data[6];
                })
                .catch(function (error) {
                    console.log(error);
                });
            //获得预约情况，把已预约的对应按钮的类型改成success
            axios.post('/pgrInfo/getRotaArray', {
                id: sessionStorage.getItem('id')
            })
                .then(function (response) {
                    //遍历数据，修改按钮类型
                    for (var i = 0; i < response.data.length; i++) {
                        if (response.data[i] == 1) {
                            vu.form.dayType1 = "success";
                            daySign[1] = 0;
                        } else if (response.data[i] == 2) {
                            vu.form.dayType2 = "success";
                            daySign[2] = 0;
                        } else if (response.data[i] == 3) {
                            vu.form.dayType3 = "success";
                            daySign[3] = 0;
                        } else if (response.data[i] == 4) {
                            vu.form.dayType4 = "success";
                            daySign[4] = 0;
                        } else if (response.data[i] == 5) {
                            vu.form.dayType5 = "success";
                            daySign[5] = 0;
                        } else if (response.data[i] == 6) {
                            vu.form.dayType6 = "success";
                            daySign[6] = 0;
                        } else if (response.data[i] == 7) {
                            vu.form.dayType7 = "success";
                            daySign[7] = 0;
                        } else if (response.data[i] == 8) {
                            vu.form.dayType8 = "success";
                            daySign[8] = 0;
                        } else if (response.data[i] == 9) {
                            vu.form.dayType9 = "success";
                            daySign[9] = 0;
                        } else if (response.data[i] == 10) {
                            vu.form.dayType10 = "success";
                            daySign[10] = 0;
                        } else if (response.data[i] == 11) {
                            vu.form.dayType11 = "success";
                            daySign[11] = 0;
                        } else if (response.data[i] == 12) {
                            vu.form.dayType12 = "success";
                            daySign[12] = 0;
                        } else if (response.data[i] == 13) {
                            vu.form.dayType13 = "success";
                            daySign[13] = 0;
                        } else if (response.data[i] == 14) {
                            vu.form.dayType14 = "success";
                            daySign[14] = 0;
                        } else if (response.data[i] == 15) {
                            vu.form.dayType15 = "success";
                            daySign[15] = 0;
                        } else if (response.data[i] == 16) {
                            vu.form.dayType16 = "success";
                            daySign[16] = 0;
                        } else if (response.data[i] == 17) {
                            vu.form.dayType17 = "success";
                            daySign[17] = 0;
                        } else if (response.data[i] == 18) {
                            vu.form.dayType18 = "success";
                            daySign[18] = 0;
                        } else if (response.data[i] == 19) {
                            vu.form.dayType19 = "success";
                            daySign[19] = 0;
                        } else if (response.data[i] == 20) {
                            vu.form.dayType20 = "success";
                            daySign[20] = 0;
                        } else if (response.data[i] == 21) {
                            vu.form.dayType21 = "success";
                            daySign[21] = 0;
                        } else if (response.data[i] == 22) {
                            vu.form.dayType22 = "success";
                            daySign[22] = 0;
                        } else if (response.data[i] == 23) {
                            vu.form.dayType23 = "success";
                            daySign[23] = 0;
                        } else if (response.data[i] == 24) {
                            vu.form.dayType24 = "success";
                            daySign[24] = 0;
                        } else if (response.data[i] == 25) {
                            vu.form.dayType25 = "success";
                            daySign[25] = 0;
                        } else if (response.data[i] == 26) {
                            vu.form.dayType26 = "success";
                            daySign[26] = 0;
                        } else if (response.data[i] == 27) {
                            vu.form.dayType27 = "success";
                            daySign[27] = 0;
                        } else if (response.data[i] == 28) {
                            vu.form.dayType28 = "success";
                            daySign[28] = 0;
                        }
                    }
                })
                .catch(function (error) {
                    console.log(error);
                });
        },
        methods: {
            //提交预约信息
            dateSubmit: function (index) {
                var sign = daySign[index];
                axios.post('/pgrInfo/book', {
                    index: index + "", //1-28
                    sign: sign + "", //1,0
                    id: sessionStorage.getItem('id')
                })
                    .then(function (response) {
                        result = response.data.result;
                        if (result == "0") {
                            window.location.href = "/pgrInfo/pgrInfoManage";
                        }
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
        }
    });
</script>
</html>
